<!--h5文档申明-->
<!DOCTYPE html>
<!--文档语言申明  en zh-CN zh-tw -->
<html lang="zh-CN">
<head>
    <!--文档编码申明-->
    <meta charset="utf-8">
    <!--要求当前网页使用浏览器最高版本的内核来渲染-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--视口的设置：视口的宽度和设备一致，默认的缩放比例和PC端一致，用户不能自行缩放-->
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <!-- 优先加载和浏览器解释 -->

    <title>title</title>

    <!-- Bootstrap 核心样式-->
    <link href="../lib/bootstrap/css/bootstrap.css" rel="stylesheet">
    <!-- html5shiv 和  respond 分别用来解决IE8版本浏览器不支持 H5标签和媒体查询的  不兼容问题-->
    <!-- HTML5 shiv and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- 警告：不能以file形式打开，本地打开。最好http://打开 -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!-- 在 IE 9 一下引入-->
    <!--[if lt IE 9]>
    <script src="../lib/html5shiv/html5shiv.min.js"></script>
    <script src="../lib/respond/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!-- navbar 导航模块	navbar-default 默认样式 -->
<nav class="navbar navbar-default"></nav>
	<!-- 导航的内容容器 -->
	<div class="container">
		<!-- 包含 商标区域 和 切换按钮 （在移动端显示） -->
		<div class="navbar-header">
			<!-- 切换按钮 -->
			<!-- 
			 类名：collapsed  样式
			 属性：
			 data-toggle="collapse"	申明是什么组件=折叠组件
			 data-target="#bs-example-navbar-collapse-1" 控制的目标元素=选择器
			 其他：
			 aria-expanded="false"  aria-* 代表提供给屏幕阅读器使用的（盲人阅读器）
			 class="sr-only" screen read only  代表提供给屏幕阅读器使用的（盲人阅读器）
			 -->
			 <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
			     <span class="icon-bar"></span>
			     <span class="icon-bar"></span>
			     <span class="icon-bar"></span>
			 </button>
			 <!--商标区域-->
			 <a class="navbar-brand" href="#">Brand</a>
		</div>
		<!-- 导航连接  表单  其他内容  被切换 -->
		<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
		    <!--默认的导航-->
		    <ul class="nav navbar-nav">
		        <li class="active"><a href="#">Link</a></li>
		        <li><a href="#">Link</a></li>
		        <li><a href="#">Link</a></li>
		        <li><a href="#">Link</a></li>
		        <li><a href="#">Link</a></li>
		        <li><a href="#">Link</a></li>
		    </ul>
		    <!--右对齐的导航-->
		    <ul class="nav navbar-nav navbar-right">
		        <li><a href="#">Link</a></li>
		    </ul>
		</div>
	</div>


<!-- bootstrap依赖jquery-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="../lib/jquery/jquery.min.js"></script>
<!-- bootstrap js 核心文件-->
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="../lib/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>